<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../include/base.jsp" %>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>KaiSheng-客户管理系统</title>
	<!--<link rel="stylesheet" type="text/css" href="${basePath}css/bootstrap.css"/>-->
	<link href="css/application.css" media="all" rel="stylesheet" type="text/css">
	<%@include file="../include/top.jsp" %>
</head>
<body>
	<jsp:include page="../include/header.jsp">
	</jsp:include>
	
	<div class="container" style="margin-top:20px;width:100%" >
		<div class="row">
			<div class="span3 offset1" style="width:15%">
				<div class="box" style="border:0px solid #DDDDDD;font-size:18px;font-family:微软雅黑;">
					<ul class="nav nav-list"  id="myul">
						<li ><a href="#"><i class="icon-home"></i>最新动态</a></li>
						<li class="active"><a href="#"><i class="icon-user"></i>联系人</a></li>
						<li><a href="#"><i class="icon-fire"></i>任务</a></li>
						<li><a href="#"><i class="icon-file"></i>交易</a></li>
					</ul>
				</div>
			</div>
			<div class="span6" style="width:65%">
				<div class="header" style="border-radius: 10px 10px 0 0;background:#F0F5F8;height:70px;font-size:16px;border:1px solid #DDDDDD;">
					联系人列表
				</div>
					
				<div class="well" style="background-color:#fff;border: 1px solid #DDDDDD;height:500px">
					<div class="" style="float:right;background-color:#fff;border: 0px solid #DDD;width:33%">
						<h4>导入导出联系人</h4>
					 	<hr/>
						<a href="#" class="code">导入</a>或者<a href="#" class="code">导出</a>联系人
					</div>
					<div class="span6" style="margin-left:10px;width:67%;border-radius: 10px;background-color:#fff;">
				
						<div class="" style="border-radius: 15px;background-color:#fff;border: 1px solid #DDDDDD;height:auto;">
							<div class="well" style="float:right;height:auto;width:30%;padding:20px;">
								<!-- 待办任务 -->
								<div id="tasks_div" class="well">
									<div class="title">
										<div class="title">
											<p>
												<span style="font-size:18px;font-family:微软雅黑;">待办任务</span>
												&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
												<a id="example11" 
												class="btn btn-warning"
												data-animation="true" 
												data-placement="bottom"  
												data-content="
													<div class='modal-body' style='padding:0px;'>
														任务名<br/>
														<input type='text' name='' id='' style='width:130px;'/>	<br/>
														什么时候完成任务呢？<br/>
														<select name='' id='' style='width:130px;'>
															<option value=''>今天</option>
															<option value=''>明天</option>
															<option value=''>本周</option>
															<option value=''>下周</option>
															<option value=''>具体的日期和时间</option>
														</select>
														<a href=''>设置时间</a><br/>
														选择一个类别<br/>
															<select name='' id='' style='width:130px;'>
																<option value=''>无</option>
																<option value=''>电话</option>
																<option value=''>演示</option>
																<option value=''>邮件</option>
																<option value=''>传真</option>
																<option value=''>会议</option>
																<option value=''>感谢</option>
																<option value=''>新的类别</option>
															</select>
															<a href='edittype.html'>编辑类别</a> <br/>
														<label class='checkbox'>
															<input type='checkbox'> 让所有人都可见这个任务
														 </label><br/>
													 </div>
													  <div class='modal-footer' style='padding:10px 0px;'>
														<button class='btn btn-success'><span style='font-size:14px'>添加任务</span></button>
														&nbsp;&nbsp;或者<button type='reset' class='btn'>取消</button>
													  </div>
												" 
												rel="popover" href="#" data-original-title="添加一个新的任务">
													<i class="icon-plus"></i>添加新任务
												</a>
											</p>	
										</div>
										<script type="text/javascript">
											$(document).ready(function(){
													$('#example11').popover();
											});
										</script>
										<div id="upcoming_tasks">
											<div id="screen_body">
											<c:if test="${fn:length(oldList) > 0 }">
												<div class="tasks overdue">
													<legend>已过期</legend>
													<c:forEach items="${oldList }" var="t">
														<div id="task_818252" class="task checkbox">
															<span class="task_hover">
																<div class="task_actions" style="display: none; ">
																	<a href="javascript:;" onclick="deleteTask(this)"  id="${t.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete"  title="删除这个任务"></a>
																	<a href="#" class="icon-edit" id="${t.id }" onclick="edittask(this)"></a>
																</div>
																
																<input id="${t.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="1"/>
																<blockquote>
																  <span style="background:#${t.tasktype.color};border-radius: 3px 3px 3px 3px;padding:1px 5px;color:#fff">${t.tasktype.type }</span>
																  <span>${t.title }</span>
																  <c:if test="${t.deal  != null}">
																	( <i class="icon-dollar"></i>
																	<a href="${basePath }/deal/show.action?id=${t.deal.id}">${t.deal.title }</a> )
																  </c:if>
																  <c:if test="${t.contact  != null}">
																	( <i class="icon-person"></i>
																	<a href="${basePath }/contact/show.action?id=${t.contact.id}">${t.contact.name }</a> )
																  </c:if>
																  <small>【${t.start } - ${t.end}】</small>
																</blockquote>
															</span>
														</div>
														<div class="edit" style="display:none; border:#CACED5 5px solid;width:450px">
															<form accept-charset="UTF-8"  action="${basePath}/task/saveedit.action" class="form-inline" id="edit_category" method="post">
																<input id="user_id" name="user.id" type="hidden" value="${user.id }">
																<input id="task_id" name="task.id" type="hidden" value="${t.id }">
																<input id="task_type_id"  type="hidden" value="${t.tasktype.id }">
																<div class="modal-header">
																	<h3>编辑这个任务</h3>
																</div>
													
																<div class="modal-body">
																	<div class="control-group string optional">
																		<div class="controls">
																			<input class="string optional span9" id="task_title" name="task.title" size="50" type="text" value="${t.title }">
																		</div>
																	</div>
													
																	<div class="control-group string optional">
																		<label class="string optional control-label" for="schedule_frame"> 到期时间？</label>
																		<div class="controls">
																			<select id="task_frame" name="time" onchange="change_task_frame($(this).val(), '#calendar_start_old','#calendar_end_old')">
																				<option value="today" selected="selected">今天</option>
																				<option value="tomorrow">明天</option>
																				<option value="calendar">设置具体时间 ...</option>
																			</select>
																		</div>
																	</div>		
																	<span id="calendar_select">
																		<input id="calendar_start_old" name="task.start" type="text" onclick="WdatePicker({minDate:'%y-%M-{%d}',readOnly:true,dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入开始时间" style=" width:200px ;display:none; "/>
																		&nbsp;
																		<input id="calendar_end_old" name="task.end" type="text" onclick="WdatePicker({readOnly:true,minDate:'#F{$dp.$D(\'calendar_date_start\')}',dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入结束时间" style=" width:200px ;display:none; "/>
																	</span>
														
																	<div class="control-group integer optional">
																		<label class="integer optional control-label" for="tasktype_id"> 选择一个分类</label>
																		<div class="controls">
																			<select  id="tasktype_id" name="tasktype.id" onchange="changeType(this)">
																				<option value="">无</option>
																				
																				<c:forEach items="${tasktypeList}" var="tasktype">
																					<option id="select" value="${tasktype.id }">${tasktype.type }</option>
																				</c:forEach>
																				
																				<option value="new">添加分类 ...</option>
																			</select>
																			<a href="${basePath }/crm/task/edittype.action">编辑分类</a>
																		</div>
																	</div>	
																</div>
													
																<button type="submit" class="btn btn-primary">保存修改</button>
																<button type="button" class="btn cancel">取消</button>
															</form>
														</div>
													</c:forEach>
												</div>	
											</c:if>
																		
											<c:if test="${fn:length(todayList) > 0 }">
												<div class="tasks today" id="task_today">
													<legend>今天</legend>
													<c:forEach items="${todayList }" var="t">
														<div id="task_today" class="task checkbox">
															<span class="task_hover">
																<div class="task_actions" style="display: none; ">
																	<a href="javascript:;" onclick="deleteTask(this)"  id="${t.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete"   title="删除这个任务"></a>
																	<a href="#" class="icon-edit" id="${t.id }" onclick="edittask(this)"></a>
																</div>
															
																<input  id="${t.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="1"/>
																<blockquote>
																	 <span style="background:#${t.tasktype.color};border-radius: 3px 3px 3px 3px;padding:1px 5px;color:#fff">${t.tasktype.type }</span>
																	 <span>${t.title }</span>
																	 <c:if test="${t.deal  != null}">
																		( <i class="icon-dollar"></i>
																		<a href="${basePath }/deal/show.action?id=${t.deal.id}">${t.deal.title }</a> )
																	 </c:if>
																	 <c:if test="${t.contact  != null}">
																		( <i class="icon-person"></i>
																		<a href="${basePath }/contact/show.action?id=${t.contact.id}">${t.contact.name }</a> )
																	 </c:if>
																</blockquote>
															</span>
														</div>
														<div class="edit" style="display:none; border:#CACED5 5px solid;width:450px">
															<form accept-charset="UTF-8"  action="${basePath}/task/saveedit.action" class="form-inline" id="edit_category" method="post">
																<input id="user_id" name="user.id" type="hidden" value="${user.id }">
																<input id="task_id" name="task.id" type="hidden" value="${t.id }">
																<input id="task_type_id"  type="hidden" value="${t.tasktype.id }">
																<div class="modal-header">
																	<h3>编辑这个任务</h3>
																</div>
														
																<div class="modal-body">
																	<div class="control-group string optional">
																		<div class="controls">
																			<input class="string optional span9" id="task_title" name="task.title" size="50" type="text" value="${t.title }">
																		</div>
																	</div>
														
																	<div class="control-group string optional">
																		<label class="string optional control-label" for="schedule_frame"> 到期时间？</label>
																		<div class="controls">
																			<select id="task_frame" name="time" onchange="change_task_frame($(this).val(), '#calendar_start','#calendar_end')">
																				<option value="today" selected="selected">今天</option>
																				<option value="tomorrow">明天</option>
																				<option value="calendar">设置具体时间 ...</option>
																			</select>
																		</div>
																	</div>		
																	<span id="calendar_select">
																		<input id="calendar_start" name="task.start" type="text" onclick="WdatePicker({minDate:'%y-%M-{%d}',readOnly:true,dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入开始时间" style=" width:200px ;display:none; "/>
																		&nbsp;
																		<input id="calendar_end" name="task.end" type="text" onclick="WdatePicker({readOnly:true,minDate:'#F{$dp.$D(\'calendar_date_start\')}',dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入结束时间" style=" width:200px ;display:none; "/>
																	</span>
															
																	<div class="control-group integer optional">
																		<label class="integer optional control-label" for="tasktype_id"> 选择一个分类</label>
																		<div class="controls">
																			<select  id="tasktype_id" name="tasktype.id" onchange="changeType(this)">
																				<option value="">无</option>
																				
																				<c:forEach items="${tasktypeList}" var="tasktype">
																					<option id="select" value="${tasktype.id }">${tasktype.type }</option>
																				</c:forEach>
																				
																				<option value="new">添加分类 ...</option>
																			</select>
																				<a href="${basePath }/crm/task/edittype.action">编辑分类</a>
																		</div>
																	</div>	
																</div>
														
																<button type="submit" class="btn btn-primary">保存修改</button>
																<button type="button" class="btn cancel">取消</button>
															</form>
														</div>
													</c:forEach>
												</div>
											</c:if>
																				
											<c:if test="${fn:length(tomorrowList) > 0 }">
												<div class="tasks tomorrow">
													<legend>明天</legend>
													
													<c:forEach items="${tomorrowList }" var="t">
														<div id="task_818252" class="task checkbox">
															<span class="task_hover">
																<div class="task_actions" style="display: none; ">
																	<a href="javascript:;" onclick="deleteTask(this)" id="${t.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete"  title="删除这个任务"></a>
																	<a href="#" class="icon-edit" id="${t.id }" onclick="edittask(this)"></a>
																</div>
															
																<input  id="${t.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="1">
													
																<blockquote>
																	<span style="background:#${t.tasktype.color};border-radius: 3px 3px 3px 3px;padding:1px 5px;color:#fff">${t.tasktype.type }</span>
																	 <span>${t.title }</span>
																	 <c:if test="${t.deal  != null}">
																		( <i class="icon-dollar"></i>
																		<a href="${basePath }/deal/show.action?id=${t.deal.id}">${t.deal.title }</a> )
																	 </c:if>
																	 <c:if test="${t.contact  != null}">
																		( <i class="icon-person"></i>
																		<a href="${basePath }/contact/show.action?id=${t.contact.id}">${t.contact.name }</a> )
																	 </c:if>
																	  <small>【${t.start } - ${t.end}】</small>
																</blockquote>
															</span>
														</div>
																			
														<div class="edit" style="display:none; border:#CACED5 5px solid;width:450px">
															<form accept-charset="UTF-8"  action="${basePath}/task/saveedit.action" class="form-inline" id="edit_category" method="post">
																<input id="user_id" name="user.id" type="hidden" value="${user.id }">
																<input id="task_id" name="task.id" type="hidden" value="${t.id }">
																<input id="task_type_id"  type="hidden" value="${t.tasktype.id }">
																<div class="modal-header">
																	<h3>编辑这个任务</h3>
																</div>
											
																<div class="modal-body">
																	<div class="control-group string optional">
																		<div class="controls">
																			<input class="string optional span9" id="task_title" name="task.title" size="50" type="text" value="${t.title }">
																		</div>
																	</div>
											
																	<div class="control-group string optional">
																		<label class="string optional control-label" for="schedule_frame"> 到期时间？</label>
																		<div class="controls">
																			<select id="task_frame" name="time" onchange="change_task_frame($(this).val(), '#calendar_start_tom','#calendar_end_tom')">
																				<option value="today" selected="selected">今天</option>
																				<option value="tomorrow" selected="selected">明天</option>
																				<option value="calendar">设置具体时间 ...</option>
																			</select>
																		</div>
																	</div>		
																	<span id="calendar_select">
																		<input id="calendar_start_tom" name="task.start" type="text" onclick="WdatePicker({minDate:'%y-%M-{%d}',readOnly:true,dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入开始时间" style=" width:200px ;display:none; "/>
																		&nbsp;
																		<input id="calendar_end_tom" name="task.end" type="text" onclick="WdatePicker({readOnly:true,minDate:'#F{$dp.$D(\'calendar_date_start\')}',dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入结束时间" style=" width:200px ;display:none; "/>
																	</span>
											
																	<div class="control-group integer optional">
																		<label class="integer optional control-label" for="tasktype_id"> 选择一个分类</label>
																		<div class="controls">
																			<select  id="tasktype_id" name="tasktype.id" onchange="changeType(this)">
																				<option value="">无</option>
																					<c:forEach items="${tasktypeList}" var="tasktype">
																						<option id="select" value="${tasktype.id }">${tasktype.type }</option>
																					</c:forEach>
																				<option value="new">添加分类 ...</option>
																			</select>
																			<a href="${basePath }/crm/task/edittype.action">编辑分类</a>
																		</div>
																	</div>	
																</div>
												
																<button type="submit" class="btn btn-primary">保存修改</button>
																<button type="button" class="btn cancel">取消</button>
															</form>
														</div>
													</c:forEach>
												</div>
											</c:if>
											<c:if test="${fn:length(afterList) > 0 }">
												<div class="tasks later">
													<legend>以后</legend>
													
													<c:forEach items="${afterList }" var="t">
														
														<div id="task_818252" class="task checkbox">
															<span class="task_hover">
																<div class="task_actions" style="display: none; ">
																	<a href="javascript:;" onclick="deleteTask(this)"  id="${t.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete"  title="删除这个任务"></a>
																	<a href="#" class="icon-edit" id="${t.id }" onclick="edittask(this)"></a>
																</div>
															
																<input id="${t.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="1">
													
																<blockquote>
																	<span style="background:#${t.tasktype.color};border-radius: 3px 3px 3px 3px;padding:1px 5px;color:#fff">${t.tasktype.type }</span>
																	  <span>${t.title }</span>
																	   <c:if test="${t.deal  != null}">
																		( <i class="icon-dollar"></i>
																		<a href="${basePath }/deal/show.action?id=${t.deal.id}">${t.deal.title }</a> )
																	 </c:if>
																	 <c:if test="${t.contact  != null}">
																		( <i class="icon-person"></i>
																		<a href="${basePath }/contact/show.action?id=${t.contact.id}">${t.contact.name }</a> )
																	 </c:if>
																	  <small>【${t.start } - ${t.end}】</small>
																</blockquote>
															</span>
														</div>
														
														<div class="edit" style="display:none; border:#CACED5 5px solid;width:450px">
															<form accept-charset="UTF-8" action="${basePath}/task/saveedit.action" class="form-inline" id="edit_category" method="post">
																<input id="user_id" name="user.id" type="hidden" value="${user.id }">
																<input id="task_id" name="task.id" type="hidden" value="${t.id }">
																<input id="task_type_id" type="hidden" value="${t.tasktype.id }">
																<div class="modal-header">
																	<h3>编辑这个任务</h3>
																</div>
																
																<div class="modal-body">
																	<div class="control-group string optional">
																		<div class="controls">
																			<input class="string optional span9" id="task_title" name="task.title" size="50" type="text" value="${t.title }">
																		</div>
																	</div>
																
																	<div class="control-group string optional">
																		<label class="string optional control-label" for="schedule_frame"> 到期时间？</label>
																		<div class="controls">
																			<select id="task_frame" name="time" onchange="change_task_frame_after($(this).val(), '#calendar_start_after','#calendar_end_after')">
																				<option value="today" selected="selected">今天</option>
																				<option value="tomorrow">明天</option>
																				<option selected="selected" value="calendar">设置具体时间 ...</option>
																			</select>
																		</div>
																	</div>		
																	<span id="calendar_select" >
																		<input id="calendar_start_after" name="task.start" type="text" onclick="WdatePicker({minDate:'%y-%M-{%d}',readOnly:true,dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入开始时间" style=" width:200px ; display:block" value="${t.start }"/>
																		&nbsp;
																		<input id="calendar_end_after" name="task.end" type="text" onclick="WdatePicker({readOnly:true,minDate:'#F{$dp.$D(\'calendar_date_start\')}',dateFmt:'yyyy-MM-dd  HH:mm:ss',lang:'zh-cn'})" class="Wdate span2" placeholder="请输入结束时间" style=" width:200px ; display:block " value="${t.end }"/>
																	</span>
																	
																	<div class="control-group integer optional">
																		<label class="integer optional control-label" for="tasktype_id"> 选择一个分类</label>
																		<div class="controls">
																			<select  id="tasktype_id" name="tasktype.id" onchange="changeType(this)">
																				<option value="">无</option>
																				
																				<c:forEach items="${tasktypeList}" var="tasktype">
																					<option id="select" value="${tasktype.id }">${tasktype.type }</option>
																				</c:forEach>
																				
																				<option value="new">添加分类 ...</option>
																			</select>
																				<a href="${basePath }/crm/task/edittype.action">编辑分类</a>
																		</div>
																	</div>	
																</div>
																
																<script type="text/javascript">
																
																	function change_task_frame_after(a, b,c) {
																		if(a == "calendar") {
																			$(b).show(), $(c).show();
																		} else {
																			$(b).hide(), $(c).hide();
																		}
																	}
																</script>
																
																<button type="submit" class="btn btn-primary">保存修改</button>
																<button type="button" class="btn cancel">取消</button>
															</form>
														</div>
										
													</c:forEach>
												</div>
											</c:if>	
										</div>
		
										<script type="text/javascript">
															
											function edittask(obj){
											
												target = $(obj).parent().parent().parent();
												
												$(target).next(".edit").toggle();
												$("button.cancel").click(function(){
													$(target).next(".edit").hide();
												});
											}
											
											$(document).ready(function(){
												var tasktypeid = $("#task_type_id").val();
												if(tasktypeid != null) {
													$("#tasktype_id option").each(function(i){
														if(tasktypeid == $(this).val()) {
															$("#select").attr("selected","selected");
														}
													});
												}
											});			
											
										</script>
					
										<script type="text/javascript" charset="utf-8">
											function done_task(obj) {
												id = $(obj).attr("id");
												$.get("${basePath}/task/done.action",{"task.id":id},function(){
													$(obj).parent().parent().fadeOut();
												});
											}
										
											function deleteTask(obj) {
												id = $(obj).attr("id");
												$.get("${basePath}/task/delete.action",{"task.id":id},function(){
													$(obj).parent().parent().parent().fadeOut();
												});
											}
										
											$(document).ready(function() {
												$('span.task_hover').hover(function() {
													$(this).children().first().show();
												}, function() {
													$(this).children().first().hide();
												});
											});
										</script>
									</div>
								</div>
								<!-- 联系信息  -->
								<div class="well" style="position: relative;height:250px ">
									<div class="title">
										联系信息
									</div>
									<img style="width:120px;height:120px;position: absolute;top: 60px;right: 30px;" alt="" src="/qrcode/${contact.qrcode }.png">
									<ul class="nav nav-list contacts">
										<li class="nav-header">邮箱</li>
										<li>
											<c:forEach items="${contact.mailList }" var="mail">
												<div>
												<a href="#">${mail.mail }</a>
												<c:choose>
													<c:when test="${mail.type == 'personal' }">
														<span>个人</span>
													</c:when>								
													<c:when test="${mail.type == 'work' }">
														<span>工作</span>
													</c:when>									
													<c:otherwise>
														<span>其他</span>
													</c:otherwise>									
												</c:choose>
												</div>
											</c:forEach>
										</li>
										<li class="nav-header">电话</li>
										<li>
											<c:forEach items="${contact.telList }" var="tel">
												<div>
												<a href="#">${tel.tel }</a>
												<c:choose>
													<c:when test="${tel.type == 'office' }">
														<span>公司</span>
													</c:when>									
													<c:when test="${tel.type == 'home' }">
														<span>家庭</span>
													</c:when>								
													<c:otherwise>
														<span>其他</span>
													</c:otherwise>									
												</c:choose>
												</div>
											</c:forEach>
										</li>
										<li class="nav-header">个人主页</li>
										<li>
											<c:forEach items="${contact.websiteList }" var="website">
												<div>
												<a href="#">${website.website }</a>
												<c:choose>
													<c:when test="${website.type == 'office' }">
														<span>公司</span>
													</c:when>									
													<c:when test="${website.type == 'personal' }">
														<span>个人</span>
													</c:when>									
													<c:otherwise>
														<span>其他</span>
													</c:otherwise>									
												</c:choose>
												</div>
											</c:forEach>
										</li>
									</ul>
								</div>
								<!-- 背景信息 -->
								<div class="well">
									<div id="background_container">
										<div class="title">	
											背景信息
										</div>
										<div id="background_info"><p>${contact.content }</p></div>
									</div>
					
									<div id="edit_background_container" style="display:none;">
									  <!-- <form accept-charset="UTF-8" action="content.action?id=${deal.id }" id="background_form" method="post" > -->
										<div class="control-group text optional">
											<label for="contact_others" class="text optional control-label"> 修改背景信息</label>
											<input type="hidden" id="contact_id_bginfo" name="contact.id" value="${contact.id }">
											<div class="controls">
												<textarea class="content" id="contact_content" name="contact.content" required="required">${contact.content }</textarea>
											</div>
										</div>
										<div class="submit">
											<input class="btn btn-primary" id="content_btn" name="commit" type="submit" value="保存">
											<a class="btn" href="#" onclick="toggle_edit_background_info();">取消</a>
										</div>
									  <!-- </form> -->  
									</div>
								</div>
								<script type="text/javascript" charset="utf-8">
							$(document).ready(function() {
								$("#content_btn").click(function() {
									$.post("content.action",
										{"contact.id":$("#contact_id_bginfo").val(),"contact.content":$("#contact_content").val()},
										function(result){
											$("#background_info p").text(result.message);
											$('#background_container').slideDown("slow");
											$('#edit_background_container').slideUp("slow");
											
										});		
								});
							});
							function toggle_edit_background_info(edit) {
								$('#background_container').slideToggle();
								$('#edit_background_container').slideToggle();
								if (edit) $('#deal_content').focus();
							}
						</script>
								<!-- 地址(谷歌地图) -->
								<div class="well">
									<div class="title">地址:<span id="address">${contact.address }</span></div>
									<div id="map" style="width:300px;height:280px"></div>
								</div>
								<script type="text/javascript">
									var map;
									$(document).ready(function(){
										map = new GMaps({
												div: '#map',
												lat: 35.21801, 
												lng: 113.25026
										});
										GMaps.geocode({
										  address: $('#address').html(),
										  //address: "上海",
										  callback: function(results, status) {
											if (status == 'OK') {
											  var latlng = results[0].geometry.location;
											  map.setCenter(latlng.lat(), latlng.lng());
											  map.addMarker({
												lat: latlng.lat(),
												lng: latlng.lng()
											  });
											}
										  }
										});
							
									});
								</script>
							
								<script type="text/javascript">
									$(document).ready(function() {
										var fid;
										//对联系人的评论
										$("#mybtn").click(function() {
											var content = $("#note_content").val();
											var contactid = $("#target_id").val();							
											$("#note_content").val("");
											$.post("note/add.action",{"contactnote.content":content,"contactid":contactid},function(json)	{
												if(json.id != null) {
												$("#firstcol").after("<tr id=\"note-"+json.id+"\" data=\"817114\" data-from=\"Person\" class=\"note\"><td class=\"icon\"><span class=\"sprite note\"></span></td><td><div class=\"note-header\"><div style=\"float:right\"><ul class=\"nav nav-pills\"><li><a data-toggle=\"modal\" href=\"#noteModal\" data-backdrop=\"static\" class=\"notecommit\" rel=\""+json.id+"\">评论</a></li><li><a class=\"del-note\" href=\"javascript:;\" rel=\""+json.id+"\" title=\"删除\">删除</a></li></ul></div><div class=\"subject\">刚刚发布</div><div class=\"meta\"></div<div class=\"meta\"></div></div><div class=\"content\"><p>" + json.content +"</p></div><div id=\"firstnote2"+json.id+"\"></div></td></tr>");
												} else {
													$("#note_content").focus();
												}
											});
										});
										$("#note_content").ajaxError(function(event,request, settings){
											alert("ajax请求出错");
										});
										
										$(".notecommit").live('click',function() {
											fid = $(this).attr("rel");
										});
										//对评论的评论
										$("#note2").click(function() {
											var content = $("#notecontent").val();
											var contactid = $("#target_id").val();
											$.post("note/add.action",{"contactnote.content":content,"contactid":contactid,"fid":fid},function(json) {
												$("#firstnote2"+fid).after("<blockquote id=\"note2-"+json.id+"\">"+json.content+"<small>"+json.user.username+"发布于刚刚<a href=\"javascript:;\" title=\"删除\" class=\"del-note2\" rel=\""+json.id+"\"><i class=\"icon-trash\"></i></a></small></blockquote>");
											}) ;
										});						
										//删除评论
										$(".del-note").live('click',function(){
											var id = $(this).attr("rel");
											if(confirm("如果该评论还有评论，所有评论都会一并删除。 您确定要删除这个评论吗？")) {
												$.get("note/del.action",{"contactnote.id":id},function(reslut) {
													$("#note-"+id).fadeOut();
												});
											}
											
										});
										
										$(".del-note2").live('click',function(){
											var id = $(this).attr("rel");
											if(confirm("您确定要删除这个评论吗？")) {
												$.get("note/del.action",{"contactnote.id":id,"fid":"xx"},function(reslut) {
													$("#note2-"+id).fadeOut();
												});
											}
											
										});
									});
								
							</script>
							</div>
							<div style="width:65%;float:left;position:relative;height:auto;background-color:#fff;">
								<!-- 下面是显示联系人页面 -->
								<div class="">
									<div class="page-header header">
								
											<table style="width:100%;">
												<tbody>
													<tr>
														<td width="68" style="vertical-align:top;">
															<div class="contact-avatar-container" data="" data-id="774147">
																<c:choose>
																	<c:when test="${contact.companyname == null }">
																	<span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png;) no-repeat 0px 0px transparent; width: 55px; padding-top: 55px;font-size:1px"></span>
																	</c:when>
																	<c:otherwise>
																		<span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png;) no-repeat -112px 0px transparent; width: 55px; padding-top: 55px;font-size:1px"></span>
																	</c:otherwise>
																</c:choose>
															</div>
														</td>
														<td>
															<div class="right-links">
																<c:choose>
																	<c:when test="${contact.companyname == null }">
																	<a href="edit.action?id=${contact.id }&t=company" rel="tooltip" data-original-title="修改公司"><i class="icon icon-edit"></i></a>	
																	</c:when>
																	<c:otherwise>
																	<a href="edit.action?id=${contact.id }&t=contact" rel="tooltip" data-original-title="修改联系人"><i class="icon icon-edit"></i></a>
																	</c:otherwise>
																</c:choose>
															</div>
									
															${contact.name }
															<span>
																<c:if test="${contact.companyname != null }">
																公司:&nbsp;&nbsp;${contact.company.name }&nbsp;&nbsp;&nbsp;&nbsp;职位:&nbsp;&nbsp;${contact.title }<br>
																</c:if>
																微博:&nbsp;&nbsp;<a href="http://www.${contact.weibotype }/${contact.weibo }">@${contact.weibo }</a>
															</span>
														</td>
													</tr>
												</tbody>
											</table>
											
											<ul class="nav nav-tabs details-tab">
											  <li class="active">
												<a href="#notes" data-toggle="tab">评论</a>
											  </li>
											  <li class="">
												<a href="#chances" data-toggle="tab">
													业务机会 (${fn:length(dealList) })
												</a>
											  </li>
											</ul>
		
										</div>
										<div class="live_search_spinner" behavior="spinner" id="parties_loading">
											  <div class="liner">
												<h3>处理中...</h3>
												<img src="${basePath }/img/indicator.gif" alt="WorkXP">
											  </div>
										</div>
										<div class="main" id="main">
										<div class="tab-content">
											  <div class="tab-pane active" id="notes">
													<div>
														<form accept-charset="UTF-8" action="#" class="simple_form new_note" data-remote="true" id="note-form" method="post" novalidate="novalidate">
															<input type="hidden" id="target_id" name="contact.id" value="${contact.id }">
															<input id="from" name="from" type="hidden" value="Contact">
															<input id="note_parent_id" name="note[parent_id]" type="hidden">
															<input id="note_contact_id" name="note[contact_id]" type="hidden" value="774147">
															<input id="note_chance_id" name="note[chance_id]" type="hidden">
															<input id="note_kase_id" name="note[kase_id]" type="hidden">
															<div class="control-group text required">
																<div class="controls">
																	<textarea class="text required content" cols="40" id="note_content" name="contactnote.content" rows="20"></textarea>
																</div>
															</div>
											
															<div class="new_note_form_basics">
																<div class="submit right">
																	<input class="btn btn-primary" data-loading-text="处理中.." name="commit" type="button" value="保存" id="mybtn">
																</div>
																<div class="action">
																	&nbsp;&nbsp;&nbsp;&nbsp;
																</div>
															</div>
														</form>
													</div>
											
													<script type="text/javascript" charset="utf-8">
														// auto_size_textarea('holder_', 'note_content_');  
														$(document).ready(function() {
															validate_form('#note-form', true);
															PendingAttachments.init(".attachment_container");
															// $('#note_content').focus()
															
														});
													</script>
														
													<div class="modal hide" id="noteModal">
														<form accept-charset="UTF-8" action="#" class="simple_form new_schedule"  id="note_form" method="post" >	
														
															<div class="modal-header">
																<a class="close" data-dismiss="modal">×</a>
																<h3>评论</h3>
															</div>
														
															<div class="modal-body">
																<div class="control-group string optional">
																	<div class="controls">
																		<textarea rows="5" cols="30" style="width:95%" id="notecontent"></textarea>
																	</div>
																</div>
																<div class="control-group string optional">
																</div>
															</div>
											
															<div class="modal-footer" style="text-align:left;">
																<input class="btn btn-primary" name="commit" type="submit" value="提交" id="note2" data-dismiss="modal">
																<a href="#" class="btn" data-dismiss="modal">取消</a>
															</div>
														</form>
													</div>
												
													<table id="activities" class="table crm-table top no-hover" style="margin-bottom: 60px">
														<tbody id="mycontent">
															<tr id="firstcol"/>
															
															<c:forEach items="${contact.contactnoteList }" var="note">
																<c:if test="${note.fid == null }">
																	<tr id="note-${note.id }"  data-from="Person" class="note">
																		<td class="icon"><span class="sprite note"></span></td>
																		<td>
																			<div class="note-header">
																				<div style="float:right">
																					 <ul class="nav nav-pills">
																						<li><a data-toggle="modal" href="#noteModal" data-backdrop="static" class="notecommit" rel="${note.id }">评论</a></li>
																						<li>
																							<a class="del-note" href="javascript:;" rel="${note.id }" title="删除">删除</a>
																						</li>
																					 </ul>
																				</div>
																				<div class="subject">
																					<c:set value="${note.createtime }" var="time"></c:set>
																					<%String time = (String)pageContext.getAttribute("time"); %>
																					<%=DateUtil.getTime(time) %>
																				</div>
																				<div class="meta">	
																				</div>
																				<div class="meta">
																				</div>
																			</div>
																			<div class="content">
																					<p>${note.content }</p>
																			</div>
																			<div id="firstnote2${note.id }"></div>
																			<c:forEach items="${contact.contactnoteList }" var="note2">
																				<c:if test="${note2.fid != null && note2.fid == note.id }">
																					<blockquote id="note2-${note2.id }">
																					<span class='sprite comment'></span>
																					  ${note2.content }
																					  <small>
																						${note2.user.username }
																						<c:set value="${note2.createtime }" var="time2"></c:set>
																						<%String time2 = (String)pageContext.getAttribute("time2"); %>
																						<%=DateUtil.getTime(time2) %>
																						
																						<a href="javascript:;" title="删除" class="del-note2" rel="${note2.id }"><i class="icon-trash"></i></a>
																					  </small>
																					</blockquote>
																				</c:if>	
																			</c:forEach>
																		</td>
																	</tr>
																</c:if>
															</c:forEach>
															
														</tbody>
													</table>
											
													<style>
														.meta {
															line-height: 26px;
														}
														.meta li span {
															padding: 4px 8px;
															font-weight:blod;
														}
														.meta	.nav-pills li a {
														  padding: 4px 8px;
														}
														.meta .nav {
															margin-bottom: 0px;
														}
													</style>
													<script>
														$(document).ready(function() {
															bind_regarding_event();
														});
													</script>
											
											  </div>
											  <div class="tab-pane" id="people">
												
											  </div>
											  <div class="tab-pane" id="chances">
											<table class="table table-striped crm-table" id="chances">
												<tbody>
												
													<c:if test="${fn:length(dealList) == 0}">
														<div class="alert alert-info">
															还没有任何机会！您可以
															<a class="btn btn-success" href="${basePath }/deal/add.action">
																<i class="icon-plus"></i>
																添加机会
															</a>
														</div>
													</c:if>
													<c:forEach items="${dealList }" var="deal" varStatus="d">
														<tr>
															<td>
																<h4>
																	<a href="${basePath }/deal/show.action?id=${deal.id }">
																		<c:out value="【${d.count}】 ${deal.title}"/>
																	</a>
																</h4>
																<blockquote>
																	<div>${deal.content }</div>
																	<div>
																			<span style="background:#${deal.dealtype.color};" class="label">${deal.dealtype.type }</span>
																		<c:if test="${deal.money != null }">
																			￥${deal.money }
																		</c:if>
																		<c:if test="${deal.money == null }">
																			没有设置金额
																		</c:if>
																	</div>
																	<small>由  ${deal.user.username } 负责</small>
																</blockquote>
															</td>
															<td class="actions" style="width:60px">
																<span id="span_state" class="label">${deal.state }</span>
															</td>
														</tr>
																
													</c:forEach>
												</tbody>
											</table>						
											<a href="${basePath }/deal/add.action" class="btn btn-primary">添加机会</a>
										  </div>		  
										</div>
									</div>
								</div>						
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>	
	</div>
		
</body>
</html>
